<template>
	<view class="p-list">
        <view
            v-for="(v, i) in list" :key="i"
            class="item-wrap"
        >
            <ProductItem class="item" :item="v" />
        </view>
	</view>
</template>

<script>
import ProductItem from './item';

export default {
    components: {
        ProductItem
    },
    props: {
        list: {
            type: Array,
            default () {
                return []
            }
        },
    },
    computed: {
        listToArr() {
            let data = [...this.list];
            let result = [];
            for(let i = 0; i < data.length; i += 3){
                result.push(data.slice(i, i + 3));
            }
            console.log(result, '21312');
            return result;
        }

    }
}
</script>

<style lang="stylus" scoped>
.p-list
    display flex
    flex-wrap wrap
    padding  0 30rpx 0 15rpx

    .item-wrap
        display flex
        width 33.33%
        margin-bottom 24rpx
    .item
        width 100%
</style>

